<!--
 * @Author: your name
 * @Date: 2021-08-14 16:24:31
 * @LastEditTime: 2021-08-20 10:55:45
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \系统学习\VueProject\vue02\supermall\src\components\common\scroll\Scroll.vue
-->
<template>
    <div class="wrapper" ref="wrapper">
        <div class="content">
            <slot></slot>
        </div>
    </div>
</template>

<script>
import BScroll from 'better-scroll'
export default {
    name:'Scroll',
    props:{
        probeType:{
            type:Number,
            default:0
        },
        pullUpLoad:{
            type:Boolean,
            default:false
        }
        
    },
    data(){
        return {
            scroll:null,
            message:'哈哈哈'
        }
    },
    mounted(){
        //1. 创建BScroll对象
        this.scroll = new BScroll(this.$refs.wrapper,{
            probeType:this.probeType,
            pullUpLoad:this.pullUpLoad,
            click:true
        })
        // 2. 实时监听滚动的位置
        if(this.probeType ===2 || this.probeType ===3) {
            this.scroll.on('scroll', position => {
            // console.log(position);
            this.$emit('scroll',position)
        })
        }
        // console.log(this.scroll);
        // 3. 监听scroll滚动到底部
        if(this.pullUpLoad){
            this.scroll.on('pullingUp',() => {
                // console.log('监听滚动到底部');
                this.$emit('pullingUp')
            })
        }
        
    },
    methods:{
        scrollTo(x,y,time=300){
            this.scroll && this.scroll.scrollTo(x,y,time)
        },       
        refresh(){
            // console.log('------');
            this.scroll && this.scroll.refresh()
        },
        finishPullUp(){
            this.scroll && this.scroll.finishPullUp()
        },
        getScrollY(){
            return this.scroll ? this.scroll.y : 0
        }
    }
}
</script>

<style scoped>

</style>